
<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" isELIgnored="false"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%--
  Created by IntelliJ IDEA.
  User: DELL
  Date: 2021/1/24
  Time: 15:43
  To change this template use File | Settings | File Templates.
--%>


<!DOCTYPE html>

<html>
<head>
    <head>
        <!-- 页面meta -->
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">




        <title>查询所有会员</title>
        <meta name="description" content="AdminLTE2定制版">
        <meta name="keywords" content="AdminLTE2定制版">




        <!-- Tell the browser to be responsive to screen width -->
        <meta content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" name="viewport">
        <!-- Bootstrap 3.3.6 -->
        <!-- Font Awesome -->
        <!-- Ionicons -->
        <!-- iCheck -->
        <!-- Morris chart -->
        <!-- jvectormap -->
        <!-- Date Picker -->
        <!-- Daterange picker -->
        <!-- Bootstrap time Picker -->
        <!--<link rel="stylesheet" href="../../../plugins/timepicker/bootstrap-timepicker.min.css">-->
        <!-- bootstrap wysihtml5 - text editor -->
        <!--数据表格-->
        <!-- 表格树 -->
        <!-- select2 -->
        <!-- Bootstrap Color Picker -->
        <!-- bootstrap wysihtml5 - text editor -->
        <!--bootstrap-markdown-->
        <!-- Theme style -->
        <!-- AdminLTE Skins. Choose a skin from the css/skins
           folder instead of downloading all of them to reduce the load. -->
        <!-- Ion Slider -->
        <!-- ion slider Nice -->
        <!-- bootstrap slider -->
        <!-- bootstrap-datetimepicker -->

        <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
        <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
        <!--[if lt IE 9]>
        <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
        <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
        <![endif]-->








        <!-- jQuery 2.2.3 -->
        <!-- jQuery UI 1.11.4 -->
        <!-- Resolve conflict in jQuery UI tooltip with Bootstrap tooltip -->
        <!-- Bootstrap 3.3.6 -->
        <!-- Morris.js charts -->
        <!-- Sparkline -->
        <!-- jvectormap -->
        <!-- jQuery Knob Chart -->
        <!-- daterangepicker -->
        <!-- datepicker -->
        <!-- Bootstrap WYSIHTML5 -->
        <!-- Slimscroll -->
        <!-- FastClick -->
        <!-- iCheck -->
        <!-- AdminLTE App -->
        <!-- 表格树 -->
        <!-- select2 -->
        <!-- bootstrap color picker -->
        <!-- bootstrap time picker -->
        <!--<script src="../../../plugins/timepicker/bootstrap-timepicker.min.js"></script>-->
        <!-- Bootstrap WYSIHTML5 -->
        <!--bootstrap-markdown-->
        <!-- CK Editor -->
        <!-- InputMask -->
        <!-- DataTables -->
        <!-- ChartJS 1.0.1 -->
        <!-- FLOT CHARTS -->
        <!-- FLOT RESIZE PLUGIN - allows the chart to redraw when the window is resized -->
        <!-- FLOT PIE PLUGIN - also used to draw donut charts -->
        <!-- FLOT CATEGORIES PLUGIN - Used to draw bar charts -->
        <!-- jQuery Knob -->
        <!-- Sparkline -->
        <!-- Morris.js charts -->
        <!-- Ion Slider -->
        <!-- Bootstrap slider -->
        <!-- bootstrap-datetimepicker -->
        <!-- 页面meta /-->

        <link rel="stylesheet" href="${pageContext.request.contextPath}/plugins/bootstrap/css/bootstrap.min.css">
        <link rel="stylesheet" href="${pageContext.request.contextPath}/plugins/font-awesome/css/font-awesome.min.css">
        <link rel="stylesheet" href="${pageContext.request.contextPath}/plugins/ionicons/css/ionicons.min.css">
        <link rel="stylesheet" href="${pageContext.request.contextPath}/plugins/iCheck/square/blue.css">
        <link rel="stylesheet" href="${pageContext.request.contextPath}/plugins/morris/morris.css">
        <link rel="stylesheet" href="${pageContext.request.contextPath}/plugins/jvectormap/jquery-jvectormap-1.2.2.css">
        <link rel="stylesheet" href="${pageContext.request.contextPath}/plugins/datepicker/datepicker3.css">
        <link rel="stylesheet" href="${pageContext.request.contextPath}/plugins/daterangepicker/daterangepicker.css">
        <link rel="stylesheet" href="${pageContext.request.contextPath}/plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.min.css">
        <link rel="stylesheet" href="${pageContext.request.contextPath}/plugins/datatables/dataTables.bootstrap.css">
        <link rel="stylesheet" href="${pageContext.request.contextPath}/plugins/treeTable/jquery.treetable.css">
        <link rel="stylesheet" href="${pageContext.request.contextPath}/plugins/treeTable/jquery.treetable.theme.default.css">
        <link rel="stylesheet" href="${pageContext.request.contextPath}/plugins/select2/select2.css">
        <link rel="stylesheet" href="${pageContext.request.contextPath}/plugins/colorpicker/bootstrap-colorpicker.min.css">
        <link rel="stylesheet" href="${pageContext.request.contextPath}/plugins/bootstrap-markdown/css/bootstrap-markdown.min.css">
        <link rel="stylesheet" href="${pageContext.request.contextPath}/plugins/adminLTE/css/AdminLTE.css">
        <link rel="stylesheet" href="${pageContext.request.contextPath}/plugins/adminLTE/css/skins/_all-skins.min.css">
        <link rel="stylesheet" href="${pageContext.request.contextPath}/css/style.css">
        <link rel="stylesheet" href="${pageContext.request.contextPath}/plugins/ionslider/ion.rangeSlider.css">
        <link rel="stylesheet" href="${pageContext.request.contextPath}/plugins/ionslider/ion.rangeSlider.skinNice.css">
        <link rel="stylesheet" href="${pageContext.request.contextPath}/plugins/bootstrap-slider/slider.css">
        <link rel="stylesheet" href="${pageContext.request.contextPath}/plugins/bootstrap-datetimepicker/bootstrap-datetimepicker.css">



    </head>

</head>
<body class="hold-transition skin-purple sidebar-mini">

<div class="wrapper">

    <!-- 页面头部 -->
    <jsp:include page="header.jsp"></jsp:include>

    <!-- 页面头部 /-->

    <!-- 导航侧栏 -->

    <jsp:include page="aside.jsp"></jsp:include>
    <!-- 导航侧栏 /-->

    <!-- 内容区域 -->
    <!-- Content Wrapper. Contains page content -->
    <div class="content-wrapper">
        <!-- Content Header (Page header) -->
        <section class="content-header">
            <h1>
                数据展示
            </h1>

        </section>

        <!-- Main content -->
        <section class="content">
            <div class="row">
                <div class="col-xs-12">

                    <div class="box">
                        <div class="box-header">
                            <h3 class="box-title">会员信息</h3>
                        </div>


                        <!-- /.box-header -->
                        <div class="box-body">
<div style="background-color: #e3fff5" class="col-md-3">
                            <form role="form" action="${pageContext.request.contextPath}/vipM/FindById.do" method="get" accept-charset="utf-8">
                                <div class="box-tools pull-left">
                                    <div class="has-feedback">
                                        <label for="id1">根据id查询会员信息：</label>
                                        <input type="text" id="id1" name="id" class="form-control input-sm" placeholder="请输入id：">
                                        <span class="glyphicon glyphicon-search form-control-feedback"></span>
                                        <button style="margin-top: 20px" type="submit" class="btn btn-primary">
                                            查询
                                        </button>
                                    </div>
                                </div>
                            </form>
</div>
<div style="background-color: #ecf2ff" class="col-md-3">
                            <form role="form" action="${pageContext.request.contextPath}/vipM/findbyname.do" method="get" accept-charset="utf-8">
                                <div class="box-tools pull-left">
                                    <div class="has-feedback">
                                        <label for="name1">根据name查询会员信息：</label>
                                        <input type="text" id="name1" name="name" class="form-control input-sm" placeholder="请输入名称：">
                                        <span class="glyphicon glyphicon-search form-control-feedback"></span>
                                        <button style="margin-top: 20px" type="submit" class="btn btn-primary">
                                            查询
                                        </button>
                                    </div>
                                    </div>
                            </form>
</div>
                            <%--根据id删除信息--%>
                            <div style="background-color: #e3fff5" class="col-md-3">
                                <form role="form" action="${pageContext.request.contextPath}/vipM/delVip.do" method="get" accept-charset="utf-8">
                                    <div class="box-tools pull-left">
                                        <div class="has-feedback">
                                            <label for="id">根据id删除会员：</label>
                                            <small style="color: red">请谨慎操作，删除后不可撤回！</small>
                                            <input type="text" id="id" name="id" class="form-control input-sm" placeholder="请输入id：">
                                            <span class="glyphicon glyphicon-search form-control-feedback"></span>
                                            <button style="margin-top: 20px" type="submit" class="btn btn-primary">
                                                删除
                                            </button>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>




                            <table id="dataList" class="table table-bordered table-striped table-hover dataTable">
                                <thead>

                                <tr>
                                    <th>id</th>
                                    <th>会员名称</th>
                                    <th>个人账号</th>
                                    <th>联系地址</th>
                                    <th>积分总量</th>

                                </tr>
                                </thead>
                                <tbody>

                                    <c:forEach items="${viplist.list}" var="vipmanagement">
                                <tr>
                                    <td>${vipmanagement.id}</td>
                                    <td>${vipmanagement.name}</td>
                                    <td>${vipmanagement.accountnumber}</td>
                                    <td>${vipmanagement.contact}</td>
                                    <td>${vipmanagement.integral}</td>
                                </tr>
                                    </c:forEach>

                                </tbody>
                               <%-- <tfoot>
                                <tr>
                                </tr>
                                </tfoot>--%>
                            </table>

                            <%--分页--%>
                            <div class="box-footer">
                                <div class="pull-left">
                                    <div class="form-group form-inline">
                                        当前是第${viplist.pageNum}页,共${viplist.pages}页，
                                         每页
                                        <select class="form-control" id="changePageSize" onchange="changePageSize()">
                                            <option>点击选择</option>
                                            <option>3</option>
                                            <option>4</option>
                                            <option>5</option>
                                        </select> 条
                                    </div>
                                </div>

                                <div class="box-tools pull-right">
                                    <ul class="pagination">
                                        <li>
                                            <a href="${pageContext.request.contextPath}/vipM/findAll.do?page=1&size=${viplist.pageSize}" aria-label="Previous">首页</a>
                                        </li>
                                        <li><a href="${pageContext.request.contextPath}/vipM/findAll.do?page=${viplist.pageNum-1}&size=${viplist.pageSize}">上一页</a></li>
                                        <c:forEach begin="1" end="${viplist.pages}" var="pageNum">
                                            <li><a href="${pageContext.request.contextPath}/vipM/findAll.do?page=${pageNum}&size=${viplist.pageSize}">${pageNum}</a></li>
                                        </c:forEach>
                                        <li><a href="${pageContext.request.contextPath}/vipM/findAll.do?page=${viplist.pageNum+1}&size=${viplist.pageSize}">下一页</a></li>
                                        <li>
                                            <a href="${pageContext.request.contextPath}/vipM/findAll.do?page=${viplist.pages}&size=${viplist.pageSize}" aria-label="Next">尾页</a>
                                        </li>
                                    </ul>
                                </div>

                            </div>


                        </div>
                        <!-- /.box-body -->
                    </div>
                    <!-- /.box -->


                    <!-- /.box -->
                </div>
                <!-- /.col -->

            <!-- /.row -->
        </section>
<%--根据id查询用户--%>
<%--<div>
    <div class="row">
        <!-- left column -->
        <div class="col-md-12">
            <!-- general form elements -->
            <div class="box box-primary">
                <div class="box-header with-border">
                    <h3 class="box-title">根据id查询会员表：</h3>
                </div>
                <!-- /.box-header -->
                <!-- form start -->
                <form class="col-md-3" role="form" action="${pageContext.request.contextPath}/vipM/FindById.do" method="get" accept-charset="utf-8">
                    <div class="box-body" >

                        <div class="form-group">
                            <label for="id">根据id查询：</label>
                            <input type="text" class="form-control" name="id" id="id" placeholder="请输入id">
                        </div>
                    </div>
                    <!-- /.box-body -->

                    <div class="box-footer">
                        <button &lt;%&ndash;href="${pageContext.request.contextPath}vipM/findAll.do?page=1&size=4"&ndash;%&gt; type="submit" class="btn btn-primary">
                            查询
                        </button>
                    </div>
                </form>
            </div>
</div>

<div>
</div>
        <div class="box box-primary">
            <div class="box-header with-border">
                <h3 class="box-title">根据id查询会员表：</h3>
            </div>
            <!-- /.box-header -->
            <!-- form start -->
            <form class="col-md-3" role="form" action="${pageContext.request.contextPath}/vipM/findbyname.do" method="get" accept-charset="utf-8">
                <div class="box-body" >

                    <div class="form-group">
                        <label for="name">根据name查询：</label>
                        <input type="text" class="form-control" name="name" id="name" placeholder="请输入名称：">
                    </div>
                </div>
                <!-- /.box-body -->

                <div class="box-footer">
                    <button type="submit" class="btn btn-primary">
                        查询
                    </button>
                </div>
            </form>
        </div>
</div>



        <!-- /.content -->

    <!-- /.content-wrapper -->


    <!-- page script -->
    <!-- 内容区域 /-->



</div>--%>
        <!-- 底部导航 -->
        <div><jsp:include page="footer.jsp"></jsp:include></div>
        <!-- 底部导航 /-->

<script src="${pageContext.request.contextPath}/plugins/jQuery/jquery-2.2.3.min.js"></script>
<script src="${pageContext.request.contextPath}/plugins/jQueryUI/jquery-ui.min.js"></script>
<script>
    $.widget.bridge('uibutton', $.ui.button);
</script>
<script src="${pageContext.request.contextPath}/plugins/bootstrap/js/bootstrap.min.js"></script>
<script src="${pageContext.request.contextPath}/plugins/raphael/raphael-min.js"></script>
<script src="${pageContext.request.contextPath}/plugins/morris/morris.min.js"></script>
<script src="${pageContext.request.contextPath}/plugins/sparkline/jquery.sparkline.min.js"></script>
<script src="${pageContext.request.contextPath}/plugins/jvectormap/jquery-jvectormap-1.2.2.min.js"></script>
<script src="${pageContext.request.contextPath}/plugins/jvectormap/jquery-jvectormap-world-mill-en.js"></script>
<script src="${pageContext.request.contextPath}/plugins/knob/jquery.knob.js"></script>
<script src="${pageContext.request.contextPath}/plugins/daterangepicker/moment.min.js"></script>
<script src="${pageContext.request.contextPath}/plugins/daterangepicker/daterangepicker.js"></script>
<script src="${pageContext.request.contextPath}/plugins/daterangepicker/daterangepicker.zh-CN.js"></script>
<script src="${pageContext.request.contextPath}/plugins/datepicker/bootstrap-datepicker.js"></script>
<script src="${pageContext.request.contextPath}/plugins/datepicker/locales/bootstrap-datepicker.zh-CN.js"></script>
<script src="${pageContext.request.contextPath}/plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.all.min.js"></script>
<script src="${pageContext.request.contextPath}/plugins/slimScroll/jquery.slimscroll.min.js"></script>
<script src="${pageContext.request.contextPath}/plugins/fastclick/fastclick.js"></script>
<script src="${pageContext.request.contextPath}/plugins/iCheck/icheck.min.js"></script>
<script src="${pageContext.request.contextPath}/plugins/adminLTE/js/app.min.js"></script>
<script src="${pageContext.request.contextPath}/plugins/treeTable/jquery.treetable.js"></script>
<script src="${pageContext.request.contextPath}/plugins/select2/select2.full.min.js"></script>
<script src="${pageContext.request.contextPath}/plugins/colorpicker/bootstrap-colorpicker.min.js"></script>
<script src="${pageContext.request.contextPath}/plugins/bootstrap-wysihtml5/bootstrap-wysihtml5.zh-CN.js"></script>
<script src="${pageContext.request.contextPath}/plugins/bootstrap-markdown/js/bootstrap-markdown.js"></script>
<script src="${pageContext.request.contextPath}/plugins/bootstrap-markdown/locale/bootstrap-markdown.zh.js"></script>
<script src="${pageContext.request.contextPath}/plugins/bootstrap-markdown/js/markdown.js"></script>
<script src="${pageContext.request.contextPath}/plugins/bootstrap-markdown/js/to-markdown.js"></script>
<script src="${pageContext.request.contextPath}/plugins/ckeditor/ckeditor.js"></script>
<script src="${pageContext.request.contextPath}/plugins/input-mask/jquery.inputmask.js"></script>
<script src="${pageContext.request.contextPath}/plugins/input-mask/jquery.inputmask.date.extensions.js"></script>
<script src="${pageContext.request.contextPath}/plugins/input-mask/jquery.inputmask.extensions.js"></script>
<script src="${pageContext.request.contextPath}/plugins/datatables/jquery.dataTables.min.js"></script>
<script src="${pageContext.request.contextPath}/plugins/datatables/dataTables.bootstrap.min.js"></script>
<script src="${pageContext.request.contextPath}/plugins/chartjs/Chart.min.js"></script>
<script src="${pageContext.request.contextPath}/plugins/flot/jquery.flot.min.js"></script>
<script src="${pageContext.request.contextPath}/plugins/flot/jquery.flot.resize.min.js"></script>
<script src="${pageContext.request.contextPath}/plugins/flot/jquery.flot.pie.min.js"></script>
<script src="${pageContext.request.contextPath}/plugins/flot/jquery.flot.categories.min.js"></script>
<script src="${pageContext.request.contextPath}/plugins/ionslider/ion.rangeSlider.min.js"></script>
<script src="${pageContext.request.contextPath}/plugins/bootstrap-slider/bootstrap-slider.js"></script>
<script src="${pageContext.request.contextPath}/plugins/bootstrap-datetimepicker/bootstrap-datetimepicker.js"></script>
<script src="${pageContext.request.contextPath}/plugins/bootstrap-datetimepicker/locales/bootstrap-datetimepicker.zh-CN.js"></script>
<script>

    /*改变分页时候每页数量*/
    function changePageSize() {
        //获取下拉框的值
        var pageSize = $("#changePageSize").val();

        //向服务器发送请求，改变没页显示条数
        location.href = "${pageContext.request.contextPath}/vipM/findAll.do?page=1&size="
            + pageSize;
    }

    $(document).ready(function() {
        // 选择框
        $(".select2").select2();

        // WYSIHTML5编辑器
        $(".textarea").wysihtml5({
            locale: 'zh-CN'
        });
    });


    // 设置激活菜单
    function setSidebarActive(tagUri) {
        var liObj = $("#" + tagUri);
        if (liObj.length > 0) {
            liObj.parent().parent().addClass("active");
            liObj.addClass("active");
        }
    }


    $(function() {
        $("#example1").DataTable();
        $('#example2').DataTable({
            "paging": true,
            "lengthChange": false,
            "searching": false,
            "ordering": true,
            "info": true,
            "autoWidth": false
        });
    });


    // 激活导航位置
    setSidebarActive("tables-data");
</script>
</body>
</html>